
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<script src="../../js/vue.js"></script>
<link rel="stylesheet" href="../../element-ui/lib/theme-chalk/index.css">
<script src="../../element-ui/lib/index.js"></script>
<script src="../../js/axios-0.18.0.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="../../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../../plugins/ionicons/css/ionicons.min.css">
<link rel="stylesheet" href="../../plugins/iCheck/square/blue.css">
<link rel="stylesheet" href="../../plugins/morris/morris.css">
<link rel="stylesheet" href="../../plugins/jvectormap/jquery-jvectormap-1.2.2.css">
<link rel="stylesheet" href="../../plugins/datepicker/datepicker3.css">
<link rel="stylesheet" href="../../plugins/daterangepicker/daterangepicker.css">
<link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
<link rel="stylesheet" href="../../plugins/datatables/dataTables.bootstrap.css">
<link rel="stylesheet" href="../../plugins/treeTable/jquery.treetable.css">
<link rel="stylesheet" href="../../plugins/treeTable/jquery.treetable.theme.default.css">
<link rel="stylesheet" href="../../plugins/select2/select2.css">
<link rel="stylesheet" href="../../plugins/colorpicker/bootstrap-colorpicker.min.css">
<link rel="stylesheet" href="../../plugins/bootstrap-markdown/css/bootstrap-markdown.min.css">
<link rel="stylesheet" href="../../plugins/adminLTE/css/AdminLTE.css">
<link rel="stylesheet" href="../../plugins/adminLTE/css/skins/_all-skins.min.css">
<link rel="stylesheet" href="../../css/style.css">
<link rel="stylesheet" href="../../plugins/ionslider/ion.rangeSlider.css">
<link rel="stylesheet" href="../../plugins/ionslider/ion.rangeSlider.skinNice.css">
<link rel="stylesheet" href="../../plugins/bootstrap-slider/slider.css">
<link rel="stylesheet" href="../../plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.css">
<body>
<div id="app">
    <!-- 内容头部 -->
    <section class="content-header">
        <h1>
            读者管理
            <small>添加表单</small>
        </h1>
    </section>
    <!-- 内容头部 /-->

    <!-- 正文区域 -->
    <section class="content">

        <div class="box-body">

            <!--tab页-->
            <div class="nav-tabs-custom">

                <!--tab头-->
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#tab-form" data-toggle="tab">表单</a>
                    </li>
                </ul>
                <!--tab头/-->

                <!--tab内容-->
                <form action="http://localhost:8080/web/updatereader" method="post">
                    <div class="tab-content">
                        <!--表单内容-->
                        <div class="tab-pane active" id="tab-form" >
                            <div class="row data-type">
                                <div>
                                    <input type="hidden" class="form-control" v-model="brands.aid" name="aid">
                                </div>
                                <div class="col-md-2 title">账号</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.username" name="username">
                                </div>
                                <div class="col-md-2 title">姓名</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.name" name="name">
                                </div>
                                <div class="col-md-2 title">密码</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.password" name="password">
                                </div>

                                <div class="col-md-2 title">邮箱</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.email" name="email">
                                </div>
                                <div class="col-md-2 title">手机号</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.phone" name="phone">
                                </div>

                                <div class="col-md-2 title">可借阅天数</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control"v-model="brands.lend_num" name="lend_num">
                                </div>


                                <div class="col-md-2 title">最大借阅数</div>
                                <div class="col-md-10 data">
                                    <input type="text" class="form-control" v-model="brands.max_num" name="max_num">
                                </div>

                                <div class="col-md-2 title"></div>
                                <div class="col-md-10 data text-center">
                                    <button type="submit" class="btn bg-maroon">保存</button>
                                    <button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                <!--表单内容/-->

            </div>
            <!--tab内容/-->

        </div>
        <!--tab页/-->
        <!-- .box-footer
<div class="box-footer"></div>
-->
        <!-- /.box-footer-->
    </section>
    <!-- 正文区域 /-->

</div>
</body>
<script type="text/javascript">
    var url=window.location.search;//获取浏览器的值？id=1
    var parame=url.split("=");//用=切割url地址栏的值
    var id=parame[1];//获取到对应的参数值
    new Vue({
        //发起查询，将查询到的结果，返回给页面进行回显
        el:"#app",		//需要接管的视图区域
        data:{			//数据模型参数s
            brands:[]
        },
        methods:{		//事件方法
        },
        mounted(){
            var _this=this;//把当前的vue对象赋值给一个新的_this对象
            axios({
                method:"post",//请求方式
                url:"http://localhost:8080/web/updateuserById",//请求地址
                data:"id="+id
            }).then(function(resp){
                _this.brands=resp.data;//网络请求回来的数据赋值给_this.user
            })
        }
    })
</script>
</html>
